<template>
  <div>
    <!-- 返回上一级页面 -->
    <router-link to="/home/found">
      <van-nav-bar left-arrow />
    </router-link>

    <p>每周一重新计算排名</p>

    <!-- 圆图展示图片排名 -->
    <div class="circle">
      <div class="first">1</div>
      <div class="second">2</div>
      <div class="third">3</div>
    </div>

    <div class="p">暂无上榜用户</div>
  </div>
</template>

<script>
import { Toast } from "vant";

export default {};
</script>

<style>
p {
  font-size: 14px;
  color: rgb(16, 16, 16);
  line-height: 20px;
  text-align: left;
}

.p {
  text-align: center;
}

.circle {
  width: 300px;
  height: 300px;
  margin: 0 auto;
  margin-top: 10px;
}

.first {
  border-radius: 50%;
  width: 130px;
  height: 130px;
  margin: 0 auto;
  border-color: rgb(187, 187, 187);
  border-width: 1px;
  font-size: 14px;
  text-align: center;
  line-height: 130px;
  background: rgb(239, 239, 239);
}

.second {
  border-radius: 50%;
  width: 130px;
  height: 130px;
  border-color: rgb(187, 187, 187);
  border-width: 1px;
  font-size: 14px;
  text-align: center;
  line-height: 130px;
  background: rgb(239, 239, 239);
  margin-left: -20px;
}

.third {
  border-radius: 50%;
  width: 130px;
  height: 130px;
  border-color: rgb(187, 187, 187);
  border-width: 1px;
  font-size: 14px;
  text-align: center;
  line-height: 130px;
  background: rgb(239, 239, 239);
  margin: -130px 0 0 160px;
}
</style>
